<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head th:replace="common/competition-common :: common_head(~{::link},~{::script})">
    <meta charset="utf-8">
    <meta charset="utf-8">
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <meta content="" name="description">
    <meta content="" name="keywords">
    <!-- **********asset*************-->
    <!-- Favicons -->
    <link href="/assets/img/favicon.png" rel="icon">
    <link href="/assets/img/apple-touch-icon.png" rel="apple-touch-icon">
    <!-- Vendor CSS Files -->
    <link href="/assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="/assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
    <link href="/assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
    <link href="/assets/vendor/quill/quill.snow.css" rel="stylesheet">
    <link href="/assets/vendor/quill/quill.bubble.css" rel="stylesheet">
    <link href="/assets/vendor/remixicon/remixicon.css" rel="stylesheet">
    <link href="/assets/vendor/simple-datatables/style.css" rel="stylesheet">
    <!-- Template Main CSS File -->
    <link href="/assets/css/style.css" rel="stylesheet">
    <a class="back-to-top d-flex align-items-center justify-content-center" href="#"><i
            class="bi bi-arrow-up-short"></i></a>
    <!-- Vendor JS Files -->
    <script src="/assets/vendor/apexcharts/apexcharts.min.js"></script>
    <script src="/assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
    <script src="/assets/vendor/chart.js/chart.min.js"></script>
    <script src="/assets/vendor/echarts/echarts.min.js"></script>
    <script src="/assets/vendor/quill/quill.min.js"></script>
    <script src="/assets/vendor/simple-datatables/simple-datatables.js"></script>
    <script src="/assets/vendor/tinymce/tinymce.min.js"></script>
    <script src="/assets/vendor/php-email-form/validate.js"></script>
    <!-- Template Main JS File -->
    <script src="/assets/js/main.js"></script>
</head>
<body>
<div th:replace="common/competition-common::mall-header"></div>

<div th:replace="common/competition-common::competition-sidebar"></div>




<main id="main" class="main">
    <section class="section profile">
        <div class="row">
            <div class="col-xl-4">

                <div class="card">
                    <div class="card-body profile-card pt-4 d-flex flex-column align-items-center">

                        <img th:src="'/user/user_images/' + ${session.USER_INFO.getImage()}" alt="Profile" class="rounded-circle">
                        <h2 th:text="${session.USER_INFO.getRealname()}">王宇</h2>

                        <h3>
                            <p th:if="${session.USER_INFO.usertype==0}">赛事组织者</p>
                            <p th:if="${session.USER_INFO.usertype==1}">教师</p>
                            <p th:if="${session.USER_INFO.usertype==2}">学生</p>
                        </h3>
                        <div class="social-links mt-2">
                            <a href="#" class="twitter"><i class="bi bi-twitter"></i></a>
                            <a href="#" class="facebook"><i class="bi bi-facebook"></i></a>
                            <a href="#" class="instagram"><i class="bi bi-instagram"></i></a>
                            <a href="#" class="linkedin"><i class="bi bi-linkedin"></i></a>
                        </div>
                    </div>
                </div>

            </div>

            <div class="col-xl-8">

                <div class="card">
                    <div class="card-body pt-3">
                        <!-- Bordered Tabs -->
                        <ul class="nav nav-tabs nav-tabs-bordered">

                            <li class="nav-item">
                                <button class="nav-link active" data-bs-toggle="tab" data-bs-target="#profile-edit">修改个人信息</button>
                            </li>
                        </ul>

                            <div class="tab-pane fade show active profile-overview" id="profile-edit">

                                <!-- Profile Edit Form -->
                                <form action="/admin/tomodify" method="post">
                                    <div class="row mb-3">
                                        <label for="image" class="col-md-4 col-lg-3 col-form-label">头像</label>
                                        <div class="col-md-8 col-lg-9">
                                            <img th:src="'/user/user_images/' + ${session.USER_INFO.getImage()}" alt="Profile" class="rounded-circle" style="width:250px;margin-top:80px;">
                                            <div class="pt-2">
                                                <a href="#" class="btn btn-primary btn-sm" title="Upload new profile image" name="image"><i class="bi bi-upload"></i></a>
                                                <a href="#" class="btn btn-danger btn-sm" title="Remove my profile image"><i class="bi bi-trash"></i></a>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row mb-3">
                                        <label for="fullName" class="col-md-4 col-lg-3 col-form-label">真实姓名</label>
                                        <div class="col-md-8 col-lg-9">
                                            <input name="realname" type="text"  th:value="${realname}" class="form-control" id="fullName" value="王宇">
                                        </div>
                                    </div>


                                    <div class="row mb-3">
                                        <label for="userNumber" class="col-md-4 col-lg-3 col-form-label">用户ID</label>
                                        <div class="col-md-8 col-lg-9">
                                            <span class="form-control-plaintext"  th:text="${session.USER_INFO.getUserid()}">123456</span>
                                            <input  type="hidden"  name="userid"    th:value="${session.USER_INFO.getUserid()}" class="form-control" >
                                        </div>
                                    </div>

                                    <div class="row mb-3">
                                        <label for="about" class="col-md-4 col-lg-3 col-form-label">个人简介</label>
                                        <div class="col-md-8 col-lg-9">
                                            <textarea name="introductory" class="form-control" id="about" style="height: 100px"  th:text="${introduce}"> </textarea>
                                        </div>
                                    </div>

                                    <div class="row mb-3">
                                        <label for="occupation" class="col-md-4 col-lg-3 col-form-label">职业</label>
                                        <div class="col-md-8 col-lg-9">
                                            <div class="form-check form-check-inline">
                                                <input class="form-check-input" type="radio" name="usertype"  value="1"th:checked="${session.USER_INFO.usertype==1}">
                                                <label class="form-check-label" for="occupationStudent">老师</label>
                                            </div>
                                            <div class="form-check form-check-inline">
                                                <input class="form-check-input" type="radio" name="usertype"  value="2"th:checked="${session.USER_INFO.usertype==2}">
                                                <label class="form-check-label" for="occupationTeacher">学生</label>
                                            </div>
                                        </div>
                                    </div>


                                    <div class="row mb-3">
                                        <label for="Phone" class="col-md-4 col-lg-3 col-form-label">电话</label>
                                        <div class="col-md-8 col-lg-9">
                                            <input name="phone" type="text" class="form-control" id="Phone" th:value="${phone}" value="">
                                        </div>
                                    </div>

                                    <div class="row mb-3">
                                        <label for="Email" class="col-md-4 col-lg-3 col-form-label">电子邮件</label>
                                        <div class="col-md-8 col-lg-9">
                                            <input name="email" type="email" class="form-control" id="Email" th:value="${email}" value="">
                                        </div>
                                    </div>

                                    <div class="text-center">
                                        <button type="submit" class="btn btn-primary">提交</button>
                                    </div>
                                </form><!-- End Profile Edit Form -->

                            </div>



                        </div><!-- End Bordered Tabs -->

                    </div>
                </div>

            </div>
        </div>
    </section>

</main><!-- End #main -->






<!-- ======= Footer ======= -->
<footer id="footer" class="footer">
    <div class="copyright">
        Copyright2024@杭州助你成才计算机信息学院
    </div>

    </div>
</footer><!-- End Footer -->


</body>

</html>